<template>
    <div class="ka">
    
       <div>
        <h2>信用卡</h2>
        <span>您还未开通信用卡，马上申请享受更多服务</span>


        <p @click="to()">立即申请</p>
       </div>

    
    </div>
    </template>
    
    <script>
    export default {
      methods:{
        to(){
          this.$router.push("/transact")
        }
      }
    
    }
    </script>
    
    <style lang="scss" scoped>
        // 卡
    .ka {
      width: 90%;
      height: 1.82rem;
      margin: auto;
      background: #3269b1;
      border-radius: .1rem;
      background: url(@/assets/index/ka.jpg);
      box-sizing: border-box;
      padding-top: .2rem;
      color: #fff;
      position: relative;
      >div {
        width: 90%;
        margin: auto;
      
        span {
            font-size: .12rem;
        }
        p {
            width: 1.1rem;
            height: .3rem;
            background: #fff;
            color: #367bd4;
            font-size: .12rem;
            text-align: center;
            line-height: .3rem;
            position: absolute;
            bottom: .2rem;
            left: calc(50% - 0.55rem);
            border-radius: .15rem;
        }
      }
    }
    
    </style>